﻿<%@ Page Title="" Language="C#" MasterPageFile="~/User/UserMaster.Master" AutoEventWireup="true" CodeBehind="UserMain.aspx.cs" Inherits="BookManageSys.User.UserMain" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <style type="text/css">
        .product-container {
            background-color: #f8f9fa; /* 外围背景框颜色 */
            padding: 10px;
            border-radius: 5px;
            margin-bottom: 20px;
        }
        .product-item {
            background-color: #ffffff; /* 数据项背景颜色 */
            border: 1px solid #dee2e6;
            border-radius: 5px;
            padding: 10px;
            margin-right: 10px; /* 每两个数据项之间的间隔 */
            margin-bottom: 10px;
            display: inline-block;
            width: 290px; /* 数据项宽度 */
            vertical-align: top;
        }
        .product-item .row {
            margin-bottom: 10px; /* 每个颜色条之间的间隔 */
        }
        .product-item .row:nth-child(odd) {
            background-color: #e9ecef; /* 奇数行颜色条颜色 */
        }
        .product-item .row:nth-child(even) {
            background-color: #dee2e6; /* 偶数行颜色条颜色 */
        }
        .product-item .info {
            height: 120px; /* 信息区域高度，适应两行或三行数据 */
            overflow: hidden; /* 防止内容溢出 */
        }
        .product-item .card-img-top {
            width: 265px; /* 图片宽度 */
            height: 265px; /* 图片高度，确保图片是正方形 */
            object-fit: cover; /* 保持图片比例 */
        }
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <p>商品名称：<asp:TextBox ID="TxtSearch" runat="server"></asp:TextBox>
        &nbsp;&nbsp;
        <asp:Button ID="BtnSearch" runat="server" OnClick="BtnSearch_Click" Text="查询" />
    </p>
    <div class="product-container">
        <asp:DataList ID="DataList1" runat="server" RepeatDirection="Horizontal" OnItemCommand="DataList1_ItemCommand" RepeatColumns="5">
            <ItemTemplate>
                <div class="product-item">
                    <asp:ImageButton ID="ImageButton1" runat="server" CommandArgument='<%# Eval("productid") %>' CssClass="card-img-top" ImageUrl='<%# Eval("image") %>' CommandName="详情" />
                    <div class="row">
                        <div class="info">
                            商品名：<asp:Label ID="Label1" runat="server" Text='<%# Eval("productname") %>'></asp:Label><br />
                            价格：<asp:Label ID="Label2" runat="server" Text='<%# Eval("price") %>'></asp:Label><br />
                            库存量：<asp:Label ID="Label3" runat="server" Text='<%# Eval("stockquantity") %>'></asp:Label><br />
                            销售量：<asp:Label ID="Label4" runat="server" Text='<%# Eval("salesquantity") %>'></asp:Label><br />
                            描述：<asp:Label ID="Label5" runat="server" Text='<%# Eval("description") %>'></asp:Label>
                        </div>
                    </div>
                </div>
            </ItemTemplate>
        </asp:DataList>
    </div>
</asp:Content>
